<template>
<div>

    
    <group>

    <cell
        title="昵称：555"
        :border-intent="false"
        >
        <a href="">修改</a> 
    </cell>
    <cell
        title="动画效果"
        is-link
        :border-intent="false"
        :arrow-direction="showContent004 ? 'up' : 'down'"
        @click.native="showContent004 = !showContent004">
    </cell>
    
    

    </group>
    <group v-show='showContent004'>
            <cell-box is-link>555</cell-box>
            <cell-box>555</cell-box>
            <cell-box>555</cell-box>
            <cell-box>555</cell-box>
    </group>

    
</div>
</template>



<script>
import { Cell, CellBox, CellFormPreview, Group, Badge } from 'vux'

export default {
mounted () {
    setTimeout(() => {
    this.money = -1024
    }, 2000)
},
components: {
    Group,
    Cell,
    CellFormPreview,
    CellBox,
    Badge
},
methods: {
    onClick () {
    console.log('on click')
    }
},
data () {
    return {
        showContent004: false
    }
}
}
</script>

<style scoped>
.slide {
padding: 0 20px;
overflow: hidden;
max-height: 0;
transition: max-height .5s cubic-bezier(0, 1, 0, 1) -.1s;
}
.animate {
max-height: 9999px;
transition-timing-function: cubic-bezier(0.5, 0, 1, 0);
transition-delay: 0s;
}
</style>